<template>
	<m-layout title="反馈记录" gap="24">
		<m-block gap="0 24">
			<template v-for="(item, index) in listArr">
				<view class="li">
					<view class="head flex-between">
						<view class="fs26 fw-600">
							<text>{{ item.ctime.replace('T',' ') }}</text>
						</view>
						<view class="fs26">
							<text v-if="!item.state" class="text-red">待回复</text>
							<text v-if="item.state==1" >已回复</text>
						</view>
					</view>
					<view class="fs26 flex ai-baseline ">
						<text>反馈内容：</text>
						<view class="flex-column ">
							<text class="mtb-12">{{JSON.parse(item.content)['content']?JSON.parse(item.content)['content']:'暂无内容' }}</text>
							<view class="flex">
								<view class="flex" v-for="item2 in (JSON.parse(item.content)['imgList'])">
									<m-image2 :isPreview="true" :src="item2" size="80" class="mr-12" />
								</view>
								<!-- <view class="" v-for="item2 in item.picList">
									<m-image2 :src="item2" size="120" />
								</view> -->
							</view>
						</view>
					</view>
					<m-block bgColor="#eeedfa" radius="12" gap="16 24" spa="24 0 0" v-if="item.replycontent">
						<view class="flex fs24 text-grey" >
							<text>回复:</text>
							<text>{{ item.replycontent }}</text>
						</view>
					</m-block>
				</view>
			</template>
		</m-block>
		<m-loading :list="listArr" :index="pageIndex" :total="pageCount" :loading="isLoading" />
	</m-layout>
</template>

<script>
	import { Feedback_GetMsg } from '@/api/msg.js';
	export default {
		data() {
			return {
				listArr: [],
				pageIndex: 1,
				pageSize: 10,
				pageCount: 1,
				isLoading: true
			};
		},
		watch: {
			tabIdx() {
				this.reset();
			}
		},
		onLoad() {
			this.reset();
		},
		methods: {
			// 初始化
			reset() {
				this.pageCount = 1;
				this.pageIndex = 1;
				this.getData();
			},
			// 获取用户兑换申请数据
			async getData() {
				if (this.pageIndex > this.pageCount) {
					return;
				}
				this.isLoading = true;
				const { pageCount, list, success } = await Feedback_GetMsg({
					PageIndex: this.pageIndex,
					PageSize: this.pageSize
				});
				this.isLoading = false;
				this.pageCount = pageCount;
				list.forEach(item=>{
					item.text=JSON.parse(item.content)['content'];
					item.picList=JSON.parse(item.content)['imgList'];
				})
				console.log('list',list)
				if (this.pageIndex <= 1) {
					this.listArr = list;
				} else {
					this.listArr = [...this.listArr, ...list];
				}
				this.pageIndex++;
				uni.stopPullDownRefresh();
			}
		},
		onPullDownRefresh() {
			this.reset();
		},
		onReachBottom() {
			this.getData();
			console.log('触底了');
		}
	};
</script>

<style lang="scss">
	.li {
		padding: 27rpx 0;
	}

	.li+.li {
		border-top: 1px solid #eeeeee;
	}
</style>